import React from "react";
import { View } from '@tarojs/components'
import { backgroundObj, setSessionItem } from '@/utils/utils';
import Router from '@/utils/router';
import './index.scss'
const SuspendedGoods = (props) => {
  const { visible = {}, onClose, formData, hpFlag = '0' } = props
  const { detail = {}, show = false } = visible
  const { content = {} } = detail
  const { goodsInfo = {} } = content
  const { goodsName, cover = '', price, commerceGoodsId } = goodsInfo
  if (show) {
    return (<View className={hpFlag === '1' ? "SuspendedGoods_box SuspendedGoods_hp_box" : "SuspendedGoods_box"} onClick={(e) => {
      e.stopPropagation()
      setSessionItem({ ...formData })
      Router('shopDetail', { args: { goodsId: commerceGoodsId, ...formData, linkType: 'pay' } })
    }}>
      {/* <View className="SuspendedGoods_close"><CloseOutlined onClick={(e) => {
        e.stopPropagation()
        onClose()
      }}></CloseOutlined></View> */}
      <View className="SuspendedGoods_profile" style={{ background: `url(${cover.split(',')[0]}) no-repeat center/cover` }}>
        <View className="SuspendedGoods_player"><View className="loadingWrapper">
          <View className="loading"></View>
          <View className="loading"></View>
          <View className="loading"></View>
          <View className="loading"></View>
        </View>讲解中</View>
      </View>
      <View className="SuspendedGoods_content">
        <View className="SuspendedGoods_content_title font_noHide">{goodsName}</View>
        <View className="SuspendedGoods_content_button">
          <View className="SuspendedGoods_content_price">¥{price ? price : 0} </View>
          <View className="SuspendedGoods_content_btn"></View>
        </View>
      </View>
    </View>)
  }
  else {
    return null
  }

}

export default SuspendedGoods